<template>
	<view class="project_wt">
		<view class="head">
			<view class="head_bottom">
				<Project_wt_tabs :list="list" :current="current" @change="change">
				</Project_wt_tabs>
			</view>
		</view>
		<view class="content">
			<scroll-view :style="{
					boxSizing: 'border-box',
					width:'100vw',
					paddingTop:'5px',
					height:'calc(100vh - 50px)',
				}"
			 scroll-y="true" :lower-threshold="10" @scrolltolower="to_bottom">
				<view class="wt_item"  >
					<Poject_wt_item :data="data_list" :current="current"></Poject_wt_item>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import Project_wt_tabs from "@/components/my_components/project_wt_cp/project_wt_tabs.vue"
	import Poject_wt_item from "@/components/my_components/project_wt_cp/project_wt_item.vue"
	import Page_return from "@/components/my_components/my_bt/page_return.vue" 
	export default { //问题管理页面
		components: {
			Project_wt_tabs,
			Poject_wt_item,
			Page_return
		},
		data() {
			return {
				creater:'',
				list: [{
					name: '待处理'
				}, {
					name: '已完成'
				}, {
					name: '我创建的',
				}],
				current: 0,
				data_list: [],
				page_data: {
					page: 0,
					page_size: 10,
				},
				state: 0,
				page:1,
				size:15,
				type:'',
			};
		},
		onHide(){
			uni.setStorageSync('current',0)
			this.data_list = []
		},
		onShow(){
			this.type = uni.getStorageSync('type') || '';  //获取从首页跳转的参数
			if(this.type) uni.removeStorageSync('type');
			let state = uni.getStorageSync('state');  //获取从首页跳转的参数
			uni.removeStorageSync('state');
			switch(state){
				case 100:
					this.state = 100;
					this.current = 1;
					break;
				case 0:
					this.state = 0;
					this.current = 0;
					break;
				default:
					this.current = uni.getStorageSync('current')
					if(this.current == 2){
						this.state = -1
					}
			}
			uni.getStorage({
				key: 'setName',
				success: (res) => {
					this.creater = res.data || ''
					uni.removeStorage({
						key:'setName',
						success:res =>{
							this.get_data(this.page, this.size,this.creater);
						}
					})
				},
				fail: err =>{
					this.creater = ''
					this.get_data(this.page, this.size,this.creater);
				}
			})
		},
		methods: {
			change(index) { //当tabs被点击时
				if (index == 0) {
					this.state = 0
					this.creater = ''
				} else if (index == 1) {
					this.state = 100
					this.creater = ''
				} else if (index == 2) {
					this.state = -1
					this.creater = uni.getStorageSync('username')
				}
				this.page = 1
				this.data_list = []
				this.current = index
				this.get_data(this.page,this.size,this.creater)
			},
			get_data(page, size,creater) { //参数 页数 ，页数大小
				console.log(this.type);
				uni.showLoading({
					title: '加载中'
				});
				this.$ajax({
					url: '/wx/quest', //获取问题列表
					method: 'GET',
					data: {
						state: this.state,
						creater:creater,
						page,size,
						type:this.type,
					},
					success: (res) => {
						if(res.data.state == 200){
							res.data.data.list.forEach(item =>{
								this.data_list.push(item)
							})
						}
					},
					complete: () => {
						this.loading = false;
						uni.hideLoading();
					},
				});
			},
			to_bottom() { 
				++this.page
				this.get_data(this.page, this.size,this.creater);
			}
		},
	}
</script>

<style lang="scss" scoped>
	.project_wt {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;

		.head {
			width: 100vw;
			background-color: #ffffff;
			height: fit-content;

			>div {
				width: 100vw;
			}

			.head_content {
				padding-left: 5px;
				box-sizing: border-box;
				display: flex;
				flex-direction: row;
				justify-content: flex-start;
				align-items: center;
				background-color: #5c77ff;
				.return_bt{
					margin-right: 5px;
				}
				.centre{
					display: flex;
					flex-direction: row;
					justify-content: center;
					align-items: center;
					font-size: 15px;
					color: #fff;
				}
				// .search {
				// 	flex: 2.5;
				// 	width: 0;
				// 	display: flex;
				// 	flex-direction: row;
				// 	background-color: #f0f1f5;
				// 	justify-content: flex-start;
				// 	align-items: center;
				// 	border-radius: 15px;
				// 	box-sizing: border-box;
				// 	padding: 3px 10px;
				// 	height: 30px;

				// 	>u-icon {
				// 		margin-right: 5px;
				// 	}

				// 	.search_input {
				// 		font-size: 12px;
				// 		color: #808080;
				// 	}
				// }

				// .filter {
				// 	flex: 1;
				// 	width: 0;

				// 	>view {
				// 		display: flex;
				// 		flex-direction: row;
				// 		justify-content: center;
				// 		align-items: center;

				// 		>u-icon {
				// 			margin-left: 5px;
				// 		}
				// 	}
				// }
			}

			.head_bottom {
				padding: 5px 0 10px 0;
				height: 50px;
			}
		}

		.content {
			width: 100vw;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;

			.wt_item {
				width: 100%;
				padding: 0 15px;
				background-color: #ffffff;
			}
		}
	}
</style>
